/*!
 * BEGIN HEADER
 *
 * Contains:        Bordeaux Theme LESS
 * CVM-Role:        Theme
 * Maintainer:      Hendrik Erz
 *                  Originally by Arthur Perret (https://arthurperret.fr/)
 * License:         GNU GPL v3
 *
 * Description:     A calm theme based on the Karl Marx Stadt-theme with
 *                  modifications according to Tufte's typography. This theme
 *                  is based upon the Custom CSS by Arthur Perret.
 *
 * END HEADER
 */

@import "../theme-karl-marx-stadt/theme-main.less";

// Primary colours
@c-primary: #1bd4e9;
@c-primary-shade: #1bd4e9;
@c-secondary: #002b36;
@c-secondary-shade: #073642;

// Also make them accessible to the root
:root {
  --c-primary: @c-primary;
  // Thanks to Arthur Perret we can simply use the secondary color in this case!
  --c-primary-contrast: @c-secondary;
  --c-primary-shade: @c-primary-shade;

  --c-secondary: @c-secondary;
  --c-secondary-shade: @c-secondary-shade;
}

body {

  // LIGHT THEME
  .cm-fenced-code.cm-comment {
    font-style: normal;
  }

  .cm-string {
    font-family: inherit;
  }

  // GENERAL EDITOR STYLES
  #editor {
    background-color: #fffff8;

    .CodeMirror,
    .CodeMirror .cm-comment,
    .CodeMirror .cm-fenced-code,
    .CodeMirror .cm-formatting-task,
    .CodeMirror .cm-formatting-code-block,
    .CodeMirror .cm-formatting-list-ol,
    .CodeMirror .cm-formatting-list-ul {
      font-family: 'Inconsolata', Consolas, Menlo, monospace;
    }

    .CodeMirror-focused .CodeMirror-selected,
    .CodeMirror .CodeMirror-selected {
      background-color: fade(@c-primary, 20%);
    }

    .CodeMirror {

      // EDITOR SPECIFIC
      // Formattings
      .cm-hr,
      .cm-em,
      .cm-strong,
      .cm-formatting-list-ul,
      .cm-formatting-list-ol {
        color: inherit;
      }

      .cm-quote,
      .cm-quote.cm-em,
      .cm-quote.cm-strong {
        color: #555;
      }

      .cm-fenced-code.cm-link,
      .cm-fenced-code.cm-comment,
      .cm-string {
        color: #999999;
      }

      .cm-fenced-code.cm-atom,
      .cm-formatting-header-1,
      .cm-formatting-header-2,
      .cm-formatting-header-3,
      .cm-formatting-header-4,
      .cm-formatting-header-5,
      .cm-formatting-header-6,
      .citeproc-citation {
        background-color: inherit; // Should be fine with the other styles
        color: #d02325;
      }

      .cm-link,
      .cma {
        color: inherit;
        text-decoration: underline;
      }

      .cm-table {
        font-family: 'Inconsolata', Consolas, Menlo, monospace;
        font-weight: 400;
      }
    }
  }

  &.dark {

    // DARK THEME
    #editor {
      background-color: #002b36;

      // Style the code block line wrapper classes
      .CodeMirror .code-block-line {
        background-color: #111111;
      }
    }

    #editor .CodeMirror {
      color: #839496;
    }

    .cm-quote,
    .cm-link,
    .cm-strong,
    .cm-em {
      color: #93a1a1;
    }

    .citeproc-citation {
      color: #dc322f;
    }
  }
}
